/*
 * @Author: byron
 * @Date: 2021-09-23 14:30:03
 * @LastEditTime: 2021-10-07 08:59:59
 */
import Vue from 'vue'
import VueRouter from 'vue-router'
Vue.use(VueRouter)

const Discovery = () =>
    import(/* webpackChunkName: "group-foo" */ './pages/discovery')
const Playlists = () =>
    import(/* webpackChunkName: "group-foo" */ '@/pages/playlists')
const Songs = () => import(/* webpackChunkName: "group-foo" */ '@/pages/songs')
const Mvs = () => import(/* webpackChunkName: "group-foo" */ '@/pages/mvs')
const search = () =>
    import(/* webpackChunkName: "group-foo" */ '@/pages/search')
const SearchSongs = () =>
    import(/* webpackChunkName: "group-foo" */ '@/pages/search/songs')
const SearchMvs = () =>
    import(/* webpackChunkName: "group-foo" */ '@/pages/search/mvs')
const SearchPlaylists = () =>
    import(/* webpackChunkName: "group-foo" */ '@/pages/search/playlists')
const Mv = () => import(/* webpackChunkName: "group-foo" */ '@/pages/mv')
const PlaylistsDetail = () =>
    import(/* webpackChunkName: "group-foo" */ '@/pages/playlists-detail')

// 需要居中的页面

export const layoutCenterRoutes = ['discovery', 'playlists', 'songs', 'mvs']
// 显示在左边菜单栏菜单的页面
export const menuRoutes = [
    {
        path: '/discovery',
        name: 'discovery',
        meta: {
            title: '发现音乐',
            type: 'yinle1',
        },
        component: Discovery,
    },
    {
        path: '/playlists',
        name: 'playlists',
        meta: {
            title: '推荐歌单',
            type: 'music_playlist',
        },
        component: Playlists,
    },
    {
        path: '/songs',
        name: 'songs',

        meta: {
            title: '最新音乐',
            type: 'yinle',
        },
        component: Songs,
    },
    {
        path: '/mvs',
        name: 'mvs',
        meta: {
            title: '最新mv',
            type: 'MV',
        },
        component: Mvs,
    },
]

const routes = [
    {
        props: true,
        path: '/search/:keywords',
        component: search,
        children: [
            {
                path: 'songs',
                name: 'searchsongs',
                component: SearchSongs,
            },
            {
                path: 'mvs',
                name: 'searchmvs',
                component: SearchMvs,
            },
            {
                path: 'playlists',
                name: 'searchplaylists',

                component: SearchPlaylists,
            },
            { path: '/', redirect: 'songs' },
        ],
    },
    {
        props: true,
        path: '/mv/:mvId',
        component: Mv,
    },
    {
        props: true,
        path: '/play/:songId',
        component: PlaylistsDetail,
    },
    { path: '/', redirect: '/discovery' },
    ...menuRoutes,
]

export default new VueRouter({
    routes,
})
